<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="component/heard :: head"></head>
<body>
<nav th:include="component/nav :: nav"></nav>

<script src="/js/mycard.js"></script>
<div class="container">
    <form id="CardForm" style="margin-top: 20px;">
        <div class="mb-3">
            <input type="text" id="cardId" class="form-control" th:value="${card?.id}" name="id" hidden>
        </div>
        <div class="mb-3">
            <label for="formGroupExampleInput" class="form-label">标题</label>
            <input type="text" class="form-control" th:value="${card?.title}" name="title"
                   id="formGroupExampleInput"
                   placeholder="title">
        </div>
        <div class="mb-3">
            <label for="exampleFormControlTextarea1" class="form-label">描述</label>
            <textarea class="form-control" th:text="${card?.content}" name="content"
                      id="exampleFormControlTextarea1"
                      rows="3"></textarea>
        </div>
        <div class="mb-3">
            <p class="col-form-label col-sm-2 pt-0">类型</p>
            <div th:each="type : ${cardType}">
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="category" th:id="${type.supertype}+'id'"
                           th:value="${type.supertype}"
                           th:checked="${card?.category} eq ${type.supertype}">
                    <label class="form-check-label" th:for="${type.supertype}+'id'" th:text="${type.supertype}">
                        oauth
                    </label>
                </div>
            </div>
        </div>
        <button id="saveBth" type="button" class="btn btn-sm btn-primary">保存</button>
    </form>
</div>
</body>
</html>

<script>
    $(function () {
        $("#saveBth").click(function () {
            let form = '#CardForm';
            myCard.submitCard(form, {
                success: function (obj) {
                    let id = $("#cardId").val();
                    if (id === "") {
                        window.location.href = "/card/list";
                    } else {
                        window.location.href = "/card/detail/" + id;
                    }
                    alert("保存成功");
                },
                error: function (obj) {
                    alert("保存成功");
                }
            });
        })


    });

</script>
